<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head th:include="header">
</head>
<script type="text/javascript" th:inline="javascript">
		function getPage(page) {
// 			window.actPage = $(".activp a span").html();
			var order =  parseInt($("#searchBtn").attr("name"));
			var search = $("#searchText").val();
			var myJson = '{"indexPage":'+page+',"pageSize":10,"orderType":'+order+',"searchText":"'+search+'"}';
// 			if (search.length==0) {
// 				search = "+";
// 			}
// 			window.nowPage = page;
			$.ajax({
// 				url:"tag/findTagByPage/"+page+"/10/"+order+"/"+search,
				url:"tag/findTagByPage",
				type:"post",
				data: {
					indexPage:page,pageSize:10,orderType:order,searchText:search,
					callback:"content :: lables"
				},
				success:function(result){
					 $("#content").html(result);
					 setTimeout(function(){
						 $(".rightMain").css("width","84%");
					 },0);
					 $(".rightMain").css("width","85%");
					 if(typeof(tagWs)=="undefined"){
							
						}else{
							tagWs.send(myJson);
						}
				},
				error:function(err){
					console.log(err);
				}
			 })
		}
	</script>
<!-- <body> -->
<!-- 	<div id="lableViews"> -->
<!-- 		<div th:replace="menu :: facilityDiv"></div> -->
<!-- 		<div th:replace="menu :: header"></div> -->
<!-- 		<div th:replace="menu :: leftNav"></div> -->
<!-- 		<div th:replace="menu :: title"></div> -->
<!-- 		<div class="rightMain"> -->
			<div>
				<a th:href="@{/file}">跳转至文件上传</a>
			</div>
			<span id="incl" th:include="common/lableListMenu"></span>
			<div id="content"></div>
<!-- 		</div> -->
<!-- 	</div> -->
<!-- </body> -->

<script type="text/javascript" th:inline="javascript"
	th:with="basePath=${'ws://'+#request.serverName+':'+#request.serverPort+#request.contextPath}">
	window.onload = function(){
		function compare(a,b){
			a = a.substring(0,a.length-1);
			var nowVal = parseFloat(a);
			var newVal = parseFloat(b);
			if(nowVal>newVal){
				return 0;
			}else if(nowVal<newVal){
				return 1;
			}else if(nowVal==newVal){
				return -1;
			};
	}
		
	if (window.location.search==""){
		 //建立websocket链接	
		 //当websocket连接建立成功时
		    
				 var wsurl = [[${basePath +'/webSocket/tagValue.ws?indexPage=1&searchText=&pageSize=10&orderType=0'}]];
				 	 tagWs = null;
					 tagWs = new WebSocket(wsurl);
					 tagWs.onopen = function() {
					console.log('websocket 打开成功');
		    	}; 
				 //当收到服务端的消息时
				tagWs.onmessage = function(result) {
				    //result.data 是服务端发来的数据
// 				       return;
				    if(result.data=="WebSocket:connected OK!"){
				    }else{
				        var result=JSON.parse(result.data);
					    result = result.data
// 				        for(var i=0;i<result.length;i++){
							for ( var id in result) {
				        	if($("#a_"+id).length!=0){
				        	 	var myId = id;
				        	 		if($("#lastUpdataTime_"+myId+"").length!=0){
					        	 		 var updataLenth = result[id].updatetime.length-2;
										 var updatatime = result[id].updatetime.substring(0,updataLenth);
					        	 			$("#a_"+id+" .arrow").remove();
						        	 		var nowTemp=$("#lableTemp_"+myId+"").text();
						        	 		var nowHum = $("#lableHum_"+myId+"").text();
						        	 		var nowBattery = $("#lableBattery_"+myId+"").text();
						        	 		var tempType = compare(nowTemp,result[id].temp);
						        	 		if(tempType==0){
						        	 			$("#lableTemp_"+myId+"").text(result[id].temp+"℃");
						        	 			$("#lableTemp_"+myId+"").append('<span style="color:green" class="arrow">↓</span>');
						        	 		}else if(tempType==1){
						        	 			$("#lableTemp_"+myId+"").text(result[id].temp+"℃");
						        	 			$("#lableTemp_"+myId+"").append('<span style="color:red" class="arrow">↑</span>');
						        	 		};
						        	 		var humType = compare(nowHum,parseInt(result[id].hum));
						        	 		if(humType==0){
						        	 			$("#lableHum_"+myId+"").text(parseInt(result[id].hum)+"%");
						        	 			$("#lableHum_"+myId+"").append('<span style="color:green" class="arrow">↓</span>');
						        	 		}else if(humType==1){
						        	 			$("#lableHum_"+myId+"").text(parseInt(result[id].hum)+"%");
						        	 			$("#lableHum_"+myId+"").append('<span style="color:red" class="arrow">↑</span>');
						        	 		};

						        	 		var batteryType = compare(nowBattery,result[id].battery);
						        	 		if(batteryType==0){
						        	 			$("#lableBattery_"+myId+"").text(result[id].battery+"%");
						        	 			$("#lableBattery_"+myId+"").append('<span style="color:green" class="arrow">↓</span>');
						        	 		}else if(batteryType==1){
						        	 			$("#lableBattery_"+myId+"").text(result[id].battery+"%");
						        	 			$("#lableBattery_"+myId+"").append('<span style="color:red" class="arrow">↑</span>');
						        	 		};
				/* 		        	 		$("#lableHum_"+myId+"").text(result[i].tagValue.hum+"%");	            	
							            	$("#lableBattery_"+myId+"").text(result[i].tagValue.battery+"%"); */
							            	$("#lastUpdataTime_"+myId+"").text("上报时间:"+updatatime);
					        	 		}

// 					            	switch (result[i].tagValue.status){
// 					        		 case 0:
// 					        			 break;
// 					        		 case 1:
// 					        			 status_1(myId,result[i].tempAlert[0]);
// 					        			 break;
// 					        		 case 2:
// 					        			 status_2(myId,result[i].humAlert[0]);
// 					        			 break;
// 					        		 case 3:
// 					        			 status_3(myId,result[i].tempAlert[0],result[i].humAlert[0]);
// 					        			 break;
// 					        	 };
				        	 	}else{
				        	 		$("#lableHum_"+myId+"").text("未获取");
					            	$("#lableTemp_"+myId+"").text("未获取");
					            	$("#lableBattery_"+myId+"").text("未获取");
					            	$("#lastUpdataTime_"+myId+"").text("上报时间:未获取");
				        	 	};	
				        	};
				        }
				    }
				// 当websocket关闭时
				//tagWs.onclose = function() {
				 //   alert("websocket 连接关闭");
				//};
				// 当出现错误时
				tagWs.onerror = function(e) {
				    console.log("出现错误"+e);
				}
		};
	};
	
</script>
<script type="text/javascript" th:inline="javascript">
$('#lableViews',window.parent.document).find("#rightMain_title").html("标签列表");
function lable(){
	window.location.href='lable.html';
}
function router(){
	window.location.href='router.html';
}
// $('#rightMain_title').html('标签列表');	
$(".leftNav a:nth-child(1)").css("background","#1a63be");
</script>
<script type="text/javascript" th:inline="javascript">
	$(document).ready(function(){
		getPage(1);
		$("#titleRight a:nth-child(1)").click(function(){
			window.location.href='user.html';
		});
		$("#sortTime").click(function(){
	 		var sortTimeType =  parseInt($("#sortTime").attr("name"));
	 		$("#sortZone").val("区域");
	 		if(sortTimeType==1){
	 			$("#sortTime").attr("name","2");
	 			$("#sortTime").val("时间↓");
	 		}else{
	 			$("#sortTime").attr("name","1");
	 			$("#sortTime").val("时间↑");
	 		};
	 		$("#searchBtn").attr("name",sortTimeType);
	 		getPage(1);
		});
		 $("#sortZone").click(function(){
		 		var sortZoneType =  parseInt($("#sortZone").attr("name"));
		 		$("#sortTime").val("时间");
		 		if(sortZoneType==3){
		 			$("#sortZone").attr("name","4");
		 			$("#sortZone").val("区域↑");
		 		}else{
		 			$("#sortZone").attr("name","3");
		 			$("#sortZone").val("区域↓");
		 		};
		 		$("#searchBtn").attr("name",sortZoneType);
		 		getPage(1);
		 });
	});
</script>
<script th:src="${ctx+'/resources/js/user/loginout.js'}"
	type="text/javascript" th:inline="javascript"></script>
</html>
